<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.org/thymeleaf/shiro">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>往来单位列表</title>
    <link rel="stylesheet" th:href="@{/resources/layui/css/layui.css}">
</head>
<body>
<script th:src="@{/resources/layui/layui.js}"></script>
<script th:inline="none">
    //一般直接写在一个js文件中
    layui.use(['layer', 'form','table'], function(){
        var layer = layui.layer,
            form = layui.form,
            table=layui.table,
            $=layui.jquery;
        var tableVehicle=table.render({
            elem:'#unitTable',
            height:325,
            url:'/unit/getUnitList',
            id:'unitListTable',
            page:true,
            limits:[3,6,9,12],
            limit:3,
            done:function(resp){
                if(resp.code==201){
                    layer.msg(resp.message);
                }
            },
            cols:[[
                {field: 'id', title: '编号',type:"checkbox"},
                {field: 'name', title: '单位名称'},
                {field: 'unittype', title: '单位类型',templet:function(obj){
                    return obj.unittype.name;
                }},
                {field: 'telephone', title: '单位电话'},
                {field: 'contact', title: '联系人'},
                {field:'available',title:'是否启用',width:200,templet:function(obj){
                    return obj.available==1?"启用":"停用";
                }},
                {title:'操作',width:260,templet:'#unitListBar',fixed:"right",align:"center"}
            ]]
        });
        //搜索功能
        $(".searchBtn").click(function(){
            var name=$("#name").val();
            var unittypeid=$("#unittypeid").val();
            table.reload('unitListTable',{url:"/unit/getUnitList?name="+name+"&unittype.id="+unittypeid});
        });
        //往来单位类型下拉菜单
        $.ajax({
            type:"GET",
            url:"/dictionary/getUnitType",
            success:function(resp){
                //console.log(resp.data.depts);
                var unittypeList=resp.data.unittypeList;
                if(unittypeList.length>0){
                    for(var i=0;i<unittypeList.length;i++){
                        var unittype=unittypeList[i];
                        $("#unittypeid").append("<option value='"+unittype.id+"'>"+unittype.name+"</option>");
                    }
                }
                //渲染下拉菜单
                layui.form.render("select");
            }
        });
        //批量删除
        $("#removeBtn").click(function(){
            var checkStatus = table.checkStatus("vehicleListTable");
            var data = checkStatus.data;
            var ids=new Array();
            if(data.length==0){
                layer.msg("请至少选择一条信息")
            }else{
                for(var i=0;i<data.length;i++){
                    ids.push(data[i].id);
                }
                layer.confirm('确定删除选中的用户？',{icon:3,title:'提示信息'},function(index){
                    $.ajax({
                        type:"post",
                        url:"",
                        data:{ids:ids},
                        /**
                         * 使用ajax向后台传递数组必须设置traditional:true!!!！！！
                         */
                        traditional:true,
                        success:function(resp){
                            console.log(resp);
                            if(resp.code==401){
                                //刷新表格
                                tableUser.reload();
                                //关闭提示窗口
                                layer.close(index);
                            }else if(resp.code==201||resp.code==403){
                                layer.msg(resp.message);
                            }
                        }
                    });
                });
            }
        });
        $("#addBtn").click(function(){
            console.log("***////");
            //路径：goUserAdd
            //window.location.href="goUserAdd";
        });
    });
</script>
<blockquote class="layui-elem-quote quoteBox">
    <form class="layui-form">
        <div class="layui-inline">
            <input type="text" class="layui-input" id="name" placeholder="请输入单位名称，支持模糊查询">
        </div>
        <div class="layui-inline">
            <!--<input type="text" class="layui-input" id="realname" placeholder="请输入姓名">-->
            <select id="unittypeid">
                <option value="0">请选择单位类型</option>
            </select>
        </div>
        <div class="layui-inline">
            <button type="button" class="layui-btn searchBtn">
                <i class="layui-icon-search">&#xe615;</i> 搜索
            </button>
        </div>
        <div class="layui-inline">
            <button type="button" class="layui-btn layui-btn-danger" id="removeBtn">
                批量删除
            </button>
        </div>
        <div class="layui-inline">
            <button type="button" class="layui-btn layui-btn-warm" id="addBtn">
                增加单位
            </button>
        </div>
    </form>
</blockquote>
<table id="unitTable" lay-filter="unitTableList"></table>
<!--操作-->
<script type="text/html" id="unitListBar">
    <a class="layui-btn layui-btn-xs" lay-event="edit">修改</a>
    <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del">删除</a>
    <a class="layui-btn layui-btn-xs layui-btn-primary" lay-event="detail">查看详情</a>
</script>
</body>
</html>